﻿@{
    ViewData["Title"] = "Home Page";
}

<script src="@Url.Content("~/lib/jquery/dist/jquery.js")" type="text/javascript"></script>

<div class="text-center">
    <h1 class="display-4">数据库文档管理系统</h1>
    <div class="text-left"><button class="btn btn-primary" onclick="add()">添加</button></div>
    <table class="table table-striped">
        <thead>
            <tr>
                <th>名称</th>
                <th>描述</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
            @{
                List<Db> dbs = ViewData.Model as List<Db>;
            }

            @foreach (Db db in dbs)
            {
                <tr>
                    <td>@db.Name</td>
                    <td>@db.Desc</td>
                    <td>
                        <button class="btn btn-primary" onclick="show('@db.ID')">显示</button>
                        <button class="btn btn-primary" onclick="gen('@db.ID')">生成</button>
                        <button class="btn btn-primary" onclick="edit('@db.ID')">编辑</button>
                        @*<button class="btn btn-primary" id="del">删除</button>*@
                    </td>
                </tr>

            }

        </tbody>
    </table>
</div>


<div class="modal fade" id="editModal">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">DB</h4>
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            </div>
            <div class="modal-body">
                <div class="container">
                    <div class="row">
                        <div class="col-6">
                            <div class="row">
                                <label class="col-md-4 control-label"><font color="red">*</font>名称：</label>
                                <div class="col-md-8">
                                    <input type="text" id="Name" class="form-control" required />
                                </div>
                            </div>
                        </div>
                        <div class="col-6">
                            <div class="row">
                                <label class="col-md-4 control-label"> 描述：</label>
                                <div class="col-md-8">
                                    <input type="text" id="Desc" class="form-control" required />
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <input id="ID" type="hidden" />
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <div class="row">
                                <label class="col-2 control-label"> 链接：</label>
                                <div class="col-10">
                                    <input type="text" id="ConnectionString" class="form-control" required />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>               
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" onclick="save()">保存</button>
            </div>
        </div>
    </div>
</div>


<script>
    function add() {
        $('#editModal').modal('show');
    }


    function save() {
        if ($("#Name").val() != '') {
            if ($("#ID").val() != '') {
                $.post("/Home/Update", { ID: $("#ID").val(), Name: $("#Name").val(), Desc: $("#Desc").val(), ConnectionString: $("#ConnectionString").val() }).done(function () {
                    alert("更新成功！");
                    $('#editModal').modal('hide');
                    window.location.reload(true);
                }).fail(function () {
                    alert("更新失败，请重试！")
                })
            } else {
                $.post("/Home/Add", { Name: $("#Name").val(), Desc: $("#Desc").val(), ConnectionString: $("#ConnectionString").val() }).done(function () {
                    alert("新增成功！");
                    $('#editModal').modal('hide');
                    window.location.reload(true);
                }).fail(function () {
                    alert("新增失败，请重试！")
                })
            }
        }
    }

    function show(id) {
        window.open("/Home/Show?id=" + id);
    }


    function gen(id) {
        $.post("/Home/Gen", { ID: id }).done(function () {
            alert("生成成功！");
        }).fail(function () {
            alert("生成失败，请重试！")
        })
    }

    function edit(id) {
        $.get("/Home/Get?id=" + id).done(function (model) {
            $("#ID").val(model.id);
            $("#Name").val(model.name);
            $("#Desc").val(model.desc);
            //$("#ConnectionString").val(model.connectionString);

            $('#editModal').modal('show');
        });

    }

</script>